<template>
  <el-form label-width="80px">
    <el-row>
      <el-col :span="24">
        <el-form-item label="项目名称">
          <el-select v-model="xmid" size="medium" @change="getProjectInfo" style="width:100%;">
            <el-option :label="item.name" :value="item.id" v-for="(item,i) in applyList" :key="i"></el-option>
          </el-select>
        </el-form-item>
      </el-col>
    </el-row>
    <!-- 执行单位部门 -->
    <el-row>
      <!-- 公司 -->
      <el-col :span="8">
        <el-form-item label="项目编号">
          <el-input v-model="baseInfo.batch_id" placeholder="项目待分配" disabled></el-input>
        </el-form-item>
      </el-col>

      <el-col :span="8">
        <el-form-item label="执行公司">
          <el-input v-model="baseInfo.company" placeholder="项目待分配" disabled></el-input>
        </el-form-item>
      </el-col>
      <!-- 部门 -->
      <el-col :span="8">
        <el-form-item label="执行部门">
          <el-input v-model="baseInfo.dept" placeholder="项目待分配" disabled></el-input>
        </el-form-item>
      </el-col>
    </el-row>

    <!-- 创建人联系方式 -->
    <el-row>

      <el-col :span="8">
        <el-form-item label="客户名称">
          <el-input v-model="baseInfo.partner_id" placeholder="客户名称" disabled></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="8">
        <el-form-item label="项目币种" prop="currency">
          <el-input v-model="baseInfo.currency" placeholder="币种" maxlength="11" disabled></el-input>
        </el-form-item>
      </el-col>

      <el-col :span="8">
        <el-form-item label="项目城市" prop="city">
          <el-input v-model="baseInfo.city" placeholder="项目城市" disabled></el-input>
        </el-form-item>
      </el-col>
    </el-row>

    <el-row>
      <el-col :span="8">
        <el-form-item label="项目负责">
          <el-input v-model="baseInfo.leader" placeholder="负责人" disabled></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="8">
        <el-form-item label="客户对接">
          <el-input v-model="baseInfo.customer" placeholder="负责人" disabled></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="8">
        <el-form-item label="销售经理" label-width="80px">
          <el-input v-model="baseInfo.seller" placeholder="负责人" disabled></el-input>
        </el-form-item>
      </el-col>
    </el-row>

    <el-row>
      <el-col :span="8">
        <el-form-item label="项目电话">
          <el-input v-model="baseInfo.leader_mobile" placeholder="联系方式" maxlength="11" disabled></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="8">
        <el-form-item label="客户电话">
          <el-input v-model="baseInfo.customer_mobile" placeholder="联系方式" maxlength="11" disabled></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="8">
        <el-form-item label="销售电话">
          <el-input v-model="baseInfo.seller_mobile" placeholder="联系方式" maxlength="11" disabled></el-input>
        </el-form-item>
      </el-col>
    </el-row>

    <el-row>
      <!-- 开始时间 -->
      <el-col :span="8">
        <el-form-item label="立项时间">
          <el-input v-model="baseInfo.created_at" placeholder="项目待分配" disabled></el-input>
        </el-form-item>
      </el-col>

      <el-col :span="8">
        <el-form-item label="开始时间">
          <el-input v-model="baseInfo.start" placeholder="项目待分配" disabled></el-input>
        </el-form-item>
      </el-col>
      <!-- 结束时间 -->
      <el-col :span="8">
        <el-form-item label="结束时间">
          <el-input v-model="baseInfo.stop" placeholder="项目待分配" disabled></el-input>
        </el-form-item>
      </el-col>
    </el-row>


    <!--客户报价,项目成本-->
    <el-row>
      <el-col :span="8">
        <el-form-item label="立项金额">
          <el-input v-model="baseInfo.offer" placeholder="立项金额" disabled></el-input>
        </el-form-item>
      </el-col>

      <el-col :span="8">
        <el-form-item label="预算金额">
          <el-input v-model="baseInfo.offer_ys" placeholder="预算金额" disabled></el-input>
        </el-form-item>
      </el-col>

      <el-col :span="8">
        <el-form-item label="结算金额">
          <el-input v-model="baseInfo.offer_js" placeholder="结算金额" disabled></el-input>
        </el-form-item>
      </el-col>
    </el-row>

    <el-row>
      <el-col :span="8">
        <el-form-item label="立项成本">
          <el-input v-model="baseInfo.cost" placeholder="立项成本" disabled></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="8">
        <el-form-item label="预算成本">
          <el-input v-model="baseInfo.cost_ys" placeholder="预算成本" disabled></el-input>
        </el-form-item>
      </el-col>

      <el-col :span="8">
        <el-form-item label="结算成本">
          <el-input v-model="baseInfo.cost_js" placeholder="结算成本" disabled></el-input>
        </el-form-item>
      </el-col>
    </el-row>

    <el-row>
      <el-col :span="8">
        <el-form-item :label="limitName" v-if="type != 5">
          <el-input v-model="baseInfo.limit" placeholder="限额" disabled v-if="type != 4"></el-input>
          <el-input v-model="financeData.limit" placeholder="限额" disabled v-else></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="8">
        <el-form-item label="已申金额">
          <el-input v-model="applyLogList['applyedSum']" placeholder="已申金额" disabled></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="8">
        <el-form-item label="未申金额">
          <el-input v-model="applyLogList['ableSum']" placeholder="未申金额" disabled></el-input>
        </el-form-item>
      </el-col>
    </el-row>
    <!--    插槽-->
    <slot></slot>
    <!--    插槽-->

    <el-form-item label="申请记录">
      <el-collapse v-model="activeName" accordion>
        <el-collapse-item title="记录统计" name="0">
          <div v-if="applyLogList.hasOwnProperty('yiSum')">
            已审金额总计: {{ applyLogList['yiSum'] }},可申请金额: {{ applyLogList['ableSum'] }}
          </div>
        </el-collapse-item>
        <el-collapse-item title="待审记录" name="1">
          <div
            v-if="applyLogList.hasOwnProperty('dai') && applyLogList['dai'].length > 0">
            <el-table
              :data="applyLogList['dai']"
            >
              <el-table-column prop="title" label="标题"></el-table-column>
              <el-table-column prop="money" label="金额"></el-table-column>
              <el-table-column prop="date" label="日期"></el-table-column>
            </el-table>
          </div>
        </el-collapse-item>
        <el-collapse-item title="已审记录" name="2">
          <div
            v-if="applyLogList.hasOwnProperty('yi') && applyLogList['yi'].length > 0">
            <el-table
              :data="applyLogList['yi']"
            >
              <el-table-column prop="title" label="标题"></el-table-column>
              <el-table-column prop="money" label="金额"></el-table-column>
              <el-table-column prop="date" label="日期"></el-table-column>
            </el-table>
          </div>
        </el-collapse-item>

      </el-collapse>
    </el-form-item>


    <el-form-item label="添加附件">
      <MyUploadFile
        dir="finance"
        @receiveFile="changeFileList"
        ref="cwUpload"
      >
      </MyUploadFile>
    </el-form-item>

    <el-form-item label="备注">
      <el-input
        type="textarea"
        v-model="desc"
        maxlength="1500"
        show-word-limit
      ></el-input>
    </el-form-item>

    <el-form-item>
      <el-button type="primary" @click="addFinance(0)">提交</el-button>
      <el-button type="primary" @click="addFinance(1)">保存</el-button>
      <el-button type="primary" @click="restHandle">重置</el-button>
    </el-form-item>

  </el-form>

</template>

<script>
import uploadFile from "../../common/uploadFile";
import {addFinanceData, getApplyLog, getClvData, getProjectBase} from '@/apilist/Finance'
import {mapActions, mapState} from 'vuex'
import MyUploadFile from "../../common/MyUploadFile.vue";

export default {
  name: "cwCommon",
  data() {
    return {
      params: {dir: 'finance'},
      file_list: [],
      desc: '',
      xmid: '',
      baseInfo: {},
      limit_title: ['', '差旅', '采买', '报销', '付款', '发票', '借款', '押金', '收款', '临款'],
      cwid: 0,
      activeName: 1,
      applyLogList: [],//申请记录
      isSubmit: true,
    }
  },


  props: ['type', 'financeData', 'ysid', 'limit', 'name'],
  components: {uploadFile, MyUploadFile},
  computed: {
    ...mapState("FinanceData", ['applyList']),
    limitName() {
      return `${this.name}限额`
    }

  },
  methods: {
    ...mapActions("FinanceData", ['getBaseInfoActions']),
    restHandle() {
      this.xmid = ''
      this.baseInfo = {}
      this.file_list = []
      this.desc = ''
      this.cwid = 0
      this.activeName = 1
      this.applyLogList = []//申请记录
      this.$emit('clear')
      if(this.type != 1)this.$refs.cwUpload.clsNewFileList();
    },
    getProjectInfo() {
      let params = {id: this.xmid, type: this.type}
      getProjectBase(params).then(res => {
        this.baseInfo = res.data
        let limit = res.data.limit
        if (this.type == 4) {
          this.$emit('changeFkuanList', res.data.fKuanList)
        } else {
          getApplyLog({type: this.type, xmid: this.xmid, limit: limit}).then(res => {
            this.applyLogList = res.data
          })
        }
      })

    },

    changeFileList(file) {
      //console.log(fileList)
      this.file_list.push(file);
    },
    async addFinance (is_save) {
      if(!this.isSubmit) return false;
      this.isSubmit = false;
      try {
        let params = {}
        let file_list = [];
        file_list = this.$refs.cwUpload.getNewFileList();
        params['file_list'] = file_list;
        params['is_save'] = is_save
        params['type'] = this.type
        params['xmid'] = this.xmid
        params['finance'] = this.financeData
        this.financeData['desc'] = this.desc
        params['cwid'] = this.cwid
        params['batch_id'] = this.baseInfo.batch_id
        let currentMoney = this.financeData.money
        params['limit'] = this.applyLogList.limit
        params['ysid'] = this.applyLogList.ysid;

        var result = await addFinanceData(params);
        console.log("addResult:  ", result)
        await this.$success(result.msg);
        if (result.data.hasOwnProperty("cwid")) {
          this.cwid = result.data.cwid;
          if (is_save && this.type == 1) {
            await getClvData({id: this.cwid}).then((res2) => {
              if (res2.data.length > 0) this.$emit('changeClvData', res2.data)
            });
          }
        }
        await this.$router.push('/financial/list');
        this.isSubmit = true;
      }catch (e) {
        this.isSubmit = true
        Promise.reject(e)
        return false;
      }
    },
    //修改付款 的申请记录
    changeFKuanApplyLog(item) {
      getApplyLog({
        type: this.type,
        xmid: this.xmid,
        limit: item.money,
        ysid: item.id
      }).then(res => {
        this.applyLogList = res.data
      })
    },
    changeBaseInfoLimit(limit) {
      console.log('付款: ', limit)
      this.baseInfo.limit = limit
      this.$forceUpdate();
    },

  },
}
</script>

<style scoped>

</style>
